<!DOCTYPE html>
<html lang="cn">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <link rel="stylesheet" href="./css/common.css?version=1.2.8">
    <link rel="stylesheet" href="./css/01/04.css?version=1.2.8">
    <script src="./js/jquery-2.2.4.min.js?version=1.2.8"></script>
    <script src="./js/fastclick.js?version=1.2.8"></script>
    <script src="./js/hammer.min.js"></script>
    <!-- <script src="../js/template-native.js"></script> -->
</head>

<body>
    <div class="c-content mainIndex4">
        <!--********************************* top model*********************************** -->
        <div class="top-model" id="top-model">
            <div class="top-content clearfix">
                <div class="top_title">
                    <h1 class="topLeft"></h1>
                    <p class="titlep"></p>
                </div>
                <div class="system">
                    <!-- <a class="goback-syz bg-color-bg" onclick="bzApi.close()">
                        <img src="./img/04/back.png" alt="">
                    </a>-->
                    <a class="goback-sys bg-color-bg">
                        <img src="./img/04/change.png" alt="">
                    </a>
                    <a class="gonext-sys bg-color-bg">
                        <img src="./img/04/setting.png" alt="">
                    </a>
                   
                    <div class="truemodel">
                        <div class="truelists">选择模板</div>
                        <div class="changekh">修改口号</div>
                        <div class="jgsj">间隔时间</div>
                    </div>
                </div>
            </div>
        </div>
        <div class="mid-model">
            <div class="mid-left">
                <div class="m-c-t">
<!--*************************************部门简介*********************************-->
                    <div class="m-item">
                        <div class="m-q-q bg-color-border">
                            <div class="classIntru bg-color-font">
                                <i>部</i>
                                <i>门</i>
                                <i>简</i>
                                <i>介</i>
                            </div>
                            <div class="m-i-i" onclick="changetogo(1)">
                                <textarea readonly class="bg-color-font textareaW">
                                   
                                 </textarea>
                                <div class="m-job" id="m-job">
                                    <!-- <div class="m-item-j bg-color-font"><div class="circle bg-color-bg"></div><span>班组成员12人</span><span>平均年龄33岁</span></div>
                                    <div class="m-item-j bg-color-font"><div class="circle bg-color-bg"></div><span>大专及以上学历11人</span><span>中共党员44人</span></div>
                                    <div class="m-item-j bg-color-font"><div class="circle bg-color-bg"></div><span>工程师14人</span><span>助理工程师4人</span><span>高级技师3人</span><span>技师5人</span><span>高级工6人</span></div> -->
                                </div>
                            </div>
                        </div>
                    </div>
<!--*************************************部门荣誉*********************************-->
                    <div class="m-m-a">
                        <div class="m-m-person">
                            <div class="classIntru bg-color-font" onclick="changetogo(2)">
                                <i>部</i>
                                <i>门</i>
                                <i>荣</i>
                                <i>誉</i>
                            </div>
                            <div class="honer-btn" onclick="changetogo(2)">
                                <!-- <div class="honer-class">
                                    <img src="../img/honner/honour1.png" alt="">
                                </div>
                                <div class="honer-class">
                                    <img src="../img/honner/honour1.png" alt="">
                                </div>
                                <div class="honer-class">
                                    <img src="../img/honner/honour1.png" alt="">
                                </div>
                                <div class="honer-class">
                                    <img src="../img/honner/honour1.png" alt="">
                                </div> -->
                            </div>
                        </div>

                    </div>
                </div>
<!--*************************************部门成员*********************************-->
                <div class="class-public" onclick="changetogo(4)">
                    <div class="class-title">
                        <div class="c-c-p bg-color-font">
                            <i>部</i>
                            <i>门</i>
                            <i>成</i>
                            <i>员</i>
                        </div>
                    </div>
                    <div class="c-list-node">
                        <div class="c-name-left">
                            <!-- <img src="../img/01/1.png" alt="">
                              <div class="c-c-n-n bg-color-bg">
                                  <div class="c-c-z">张振华</div>
                                  <div class="c-c-bz">班长</div>
                              </div>           -->
                        </div>
                        <div class="c-name-right" id="peopleQ" onclick="changetogo(4)">
                            <!-- <div class="person-list">
                                <img src="./img/04/3.png" alt="">
                                <div class="person-name">
                                    <div class="p-top bg-color-font">张成功</div>
                                    <div class="p-job bg-color-font">标准化管理员</div>
                                </div>
                            </div>
                            <div class="person-list">
                                <img src="./img/04/3.png" alt="">
                                <div class="person-name">
                                    <div class="p-top bg-color-font">张成功</div>
                                    <div class="p-job bg-color-font">标准化管理员</div>
                                </div>
                            </div>
                            <div class="person-list">
                                <img src="./img/04/3.png" alt="">
                                <div class="person-name">
                                    <div class="p-top bg-color-font">张成功</div>
                                    <div class="p-job bg-color-font">标准化管理员</div>
                                </div>
                            </div>
                            <div class="person-list">
                                <img src="./img/04/3.png" alt="">
                                <div class="person-name">
                                    <div class="p-top bg-color-font">张成功</div>
                                    <div class="p-job bg-color-font">标准化管理员</div>
                                </div>
                            </div>
                            <div class="person-list">
                                <img src="./img/04/3.png" alt="">
                                <div class="person-name">
                                    <div class="p-top bg-color-font">张成功</div>
                                    <div class="p-job bg-color-font">标准化管理员</div>
                                </div>
                            </div>
                            <div class="person-list">
                                <img src="./img/04/3.png" alt="">
                                <div class="person-name">
                                    <div class="p-top bg-color-font">张成功</div>
                                    <div class="p-job bg-color-font">标准化管理员</div>
                                </div>
                            </div>
                            <div class="person-list">
                                <img src="./img/04/3.png" alt="">
                                <div class="person-name">
                                    <div class="p-top bg-color-font">张成功</div>
                                    <div class="p-job bg-color-font">标准化管理员</div>
                                </div>
                            </div>
                            <div class="person-list">
                                <img src="./img/04/3.png" alt="">
                                <div class="person-name">
                                    <div class="p-top bg-color-font">张成功</div>
                                    <div class="p-job bg-color-font">标准化管理员</div>
                                </div>
                            </div>
                            <div class="person-list">
                                <img src="./img/04/3.png" alt="">
                                <div class="person-name">
                                    <div class="p-top bg-color-font">张成功</div>
                                    <div class="p-job bg-color-font">标准化管理员</div>
                                </div>
                            </div>
                            <div class="person-list">
                                <img src="./img/04/3.png" alt="">
                                <div class="person-name">
                                    <div class="p-top bg-color-font">张成功</div>
                                    <div class="p-job bg-color-font">标准化管理员</div>
                                </div>
                            </div>
                            <div class="person-list">
                                <img src="./img/04/3.png" alt="">
                                <div class="person-name">
                                    <div class="p-top bg-color-font">张成功</div>
                                    <div class="p-job bg-color-font">标准化管理员</div>
                                </div>
                            </div>
                            <div class="person-list">
                                <img src="./img/04/3.png" alt="">
                                <div class="person-name">
                                    <div class="p-top bg-color-font">张成功</div>
                                    <div class="p-job bg-color-font">标准化管理员</div>
                                </div>
                            </div>
                            <div class="person-list">
                                <img src="./img/04/3.png" alt="">
                                <div class="person-name">
                                    <div class="p-top bg-color-font">张成功</div>
                                    <div class="p-job bg-color-font">标准化管理员</div>
                                </div>
                            </div>
                            <div class="person-list">
                                <img src="./img/04/3.png" alt="">
                                <div class="person-name">
                                    <div class="p-top bg-color-font">张成功</div>
                                    <div class="p-job bg-color-font">标准化管理员</div>
                                </div>
                            </div>
                            <div class="person-list">
                                <img src="./img/04/3.png" alt="">
                                <div class="person-name">
                                    <div class="p-top bg-color-font">张成功</div>
                                    <div class="p-job bg-color-font">标准化管理员</div>
                                </div>
                            </div>
                            <div class="person-list">
                                <img src="./img/04/3.png" alt="">
                                <div class="person-name">
                                    <div class="p-top bg-color-font">张成功</div>
                                    <div class="p-job bg-color-font">标准化管理员</div>
                                </div>
                            </div>
                            <div class="person-list">
                                <img src="./img/04/3.png" alt="">
                                <div class="person-name">
                                    <div class="p-top bg-color-font">张成功</div>
                                    <div class="p-job bg-color-font">标准化管理员</div>
                                </div>
                            </div>
                            <div class="person-list">
                                <img src="./img/04/3.png" alt="">
                                <div class="person-name">
                                    <div class="p-top bg-color-font">张成功</div>
                                    <div class="p-job bg-color-font">标准化管理员</div>
                                </div>
                            </div>
                            <div class="person-list">
                                <img src="./img/04/3.png" alt="">
                                <div class="person-name">
                                    <div class="p-top bg-color-font">张成功</div>
                                    <div class="p-job bg-color-font">标准化管理员</div>
                                </div>
                            </div>
                            <div class="person-list">
                                <img src="./img/04/3.png" alt="">
                                <div class="person-name">
                                    <div class="p-top bg-color-font">张成功</div>
                                    <div class="p-job bg-color-font">标准化管理员</div>
                                </div>
                            </div>
                            <div class="person-list">
                                <img src="./img/04/3.png" alt="">
                                <div class="person-name">
                                    <div class="p-top bg-color-font">张成功</div>
                                    <div class="p-job bg-color-font">标准化管理员</div>
                                </div>
                            </div>
                            <div class="person-list">
                                <img src="./img/04/3.png" alt="">
                                <div class="person-name">
                                    <div class="p-top bg-color-font">张成功</div>
                                    <div class="p-job bg-color-font">标准化管理员</div>
                                </div>
                            </div>
                            <div class="person-list">
                                <img src="./img/04/3.png" alt="">
                                <div class="person-name">
                                    <div class="p-top bg-color-font">张成功</div>
                                    <div class="p-job bg-color-font">标准化管理员</div>
                                </div>
                            </div>
                            <div class="person-list">
                                <img src="./img/04/3.png" alt="">
                                <div class="person-name">
                                    <div class="p-top bg-color-font">张成功</div>
                                    <div class="p-job bg-color-font">标准化管理员</div>
                                </div>
                            </div> -->
                        </div>
                    </div>
                </div>
            </div>
            <div class="mid-right ">
<!--*********************************风采剪影************************************-->
                <div class="honner-img" onclick="changetogo(3)">

                    <div class="classIntru bg-color-font">
                        <i>风</i>
                        <i>采</i>
                        <i>剪</i>
                        <i>影</i>
                    </div>
                    <div class="honner-imgs">
                        <!-- <div class="img-left">
                            <div class="imgWrap-1">
                                <img src="./img/demeanour2/mg1.png" alt="">
                            </div>                         
                        </div>
                        <div class="img-right img-right2 flex-column">
                            <div class="imgwrap-2">
                                <img src="./img/demeanour2/mg2.png" alt="">
                            </div>
                            <div class="imgwrap-3">
                                <img  class="img-img" src="./img/demeanour2/mg3.png" alt="">
                            </div>   
                        </div> -->
                    </div>

                    <div class="honner-imgs2">                        
                        <!-- <div class="img-left honner-img-left flex-column">
                            <div class="imgwrap-4">
                                <img src="./img/demeanour2/mg2.png" alt="">
                            </div>
                            <div class="imgwrap-5">
                                <img  class="img-img" src="./img/demeanour2/mg3.png" alt="">
                            </div>                          
                        </div>
                        <div class="img-right honner-img-right">
                            <div class="imgwrap-6">
                                <img src="./img/demeanour2/mg1.png" alt="">
                            </div>                         
                        </div>
                    </div> -->
                    
                </div>
                <!-- <div class="study-area">
                    <div class="classIntru bg-color-font">
                        <i>学</i>
                        <i>习</i>
                        <i>园</i>
                        <i>地</i>
                    </div>
                    <textarea class="textareaY" readonly>
1、没有消除不了的隐患，没有避免不了的事故.dox
1、没有消除不了的隐患，没有避免不了的事故.dox
1、没有消除不了的隐患，没有避免不了的事故.dox
1、没有消除不了的隐患，没有避免不了的事故.dox
1、没有消除不了的隐患，没有避免不了的事故.dox
1、没有消除不了的隐患，没有避免不了的事故.dox
1、没有消除不了的隐患，没有避免不了的事故.dox
1、没有消除不了的隐患，没有避免不了的事故.dox
                </textarea> -->
                    <!-- <div class="textareaY" id="h-commoms" onclick="changetogo(5)">
                    </div> -->
                </div>
            </div>
        </div>
        <!--********************************* top templete*********************************** -->
        <!--<div class="edit">
        <button id="btn">111</button>
        <textarea id="index0">

        </textarea>
        <textarea class="a-c-c" id="a-c-c">
                设备维护部电气二次班组成立于2013年,是由电气保护、电测仪表、运动、高压
        </textarea> 
    </div>-->
        <!-- 个性化弹窗 -->
        <div class="diago" style="display: none;">
            <div class="diado-content diago-active">
                <div class="diago-title bg-color-bg">
                    <div class="diago-left">个性化设置</div>
                    <div class="diago-close"></div>
                </div>
                <div class="model-content">
                    <div class="model-list">
                        <ul class="clearfix">
                            <li class="active">
                                <div class="modelDiv">
                                    <p>模板一</p>
                                    <span class="modelSpan"></span>
                                </div>
                            </li>
                            <li>
                                <div class="modelDiv">
                                    <p>模板二</p>
                                    <span class="modelSpan"></span>
                                </div>
                            </li>
                            <li>
                                <div class="modelDiv">
                                    <p>模板三</p>
                                    <span class="modelSpan"></span>
                                </div>
                            </li>
                            <li>
                                <div class="modelDiv">
                                    <p>模板四</p>
                                    <span class="modelSpan"></span>
                                </div>
                            </li>
                        </ul>
                    </div>
                </div>
                <div class="diago-bottom">
                    <div class="totrue">确定</div>
                    <div class="cancel">取消</div>
                </div>
                <div class="choose">

                </div>
            </div>
        </div>
        <!--********************************* top templete*********************************** -->
        <!--<div class="edit">
    <button id="btn">111</button>
    <textarea id="index0">

    </textarea>
    <textarea class="a-c-c" id="a-c-c">
            设备维护部电气二次班组成立于2013年,是由电气保护、电测仪表、运动、高压
    </textarea> 
</div>-->
        <div class="diagoT">
            <div class="diago-content">
                <div class="diago-title bg-color-bg">
                    <div class="diago-left">口号设置</div>
                    <div class="diago-close"></div>
                </div>
                <div class="cont-diago">
                    <input type="text" id="cont-value">
                </div>
                <div class="diago-bottom">
                    <div class="btn">确定</div>
                    <div class="cancelbtn">取消</div>
                </div>
            </div>
        </div>
        <div class="diagoTime">
            <div class="diago-content" style="width:600px;">
                <div class="diago-title bg-color-bg" style="width:600px;">
                    <div class="diago-left">间隔修改</div>
                    <div class="diago-close"></div>
                </div>
                <div class="cont-diagoTime">
                    <div class="itemt">
                        3s
                    </div>
                    <div class="itemt">
                        5s
                    </div>
                    <div class="itemt">
                        10s
                    </div>
                    <div class="itemt">
                        20s
                    </div>
                </div>
                <div class="diago-bottom">
                    <div class="btnTime">确定</div>
                    <div class="cancelbtn">取消</div>
                </div>
            </div>
        </div>
        <div id="popup">
            <div class="bg">
                <img src=""/>
            </div>
        </div>
        <!-- <script src="../js/echarts3.8.5_min.js"></script>   -->
        <script src="./js/config.js?version=1.2.8"></script>
        <script>
            var app = document.querySelector('body');
            var hammertime = new Hammer(app);
            hammertime.on('swipeleft', function(ev) {
                // console.log(ev);
                bzApi.close()
            });
            //*******************************模拟数据***************************************//
            var topData = {
                'className': '电气二次班',
                'title01': "团结就是力量",
                'title02': "创建迎来希望"
            }
            //    $(".bgcolor").css('backgroundColor',localStorage.getItem('color'));
            $(".bgcolor").css('backgroundColor', '#e84921');

            $("#btn").click(
                function () {
                    var x = $("#index0").val();
                    $('#a-c-c').html(x);
                }
            )

            $('.c-list').click(
                function (index) {
                    $('.c-list').removeClass('bg-color-bg');
                    $('.c-list-node').removeClass('active');
                    $('.c-list-node').eq($(this).index()).addClass('active');
                    $(this).addClass('bg-color-bg');
                }
            )
            $(".gonext-sys").click(
                function () {
                    if ($(".truemodel").css("display") == "block") {
                        $(".truemodel").css("display", "none");
                    } else {
                        $(".truemodel").css("display", "block");
                    }
                }
            )
            $(".truelists").click(
                function () {
                    $(".diago").css("display", "block");
                }
            )
            var numT = 0;
            $('.model-list ul li').click(function () {
                $(this).addClass('active').siblings().removeClass('active');
                numT = $(this).index();
            })

            var jpathurl = '?userId=' + userId + "&bzId=" + bzId+"&regDeptId="+regDeptId;
            // var jpathurl = '?userId=' + 'b070e77e-2289-4b58-979b-2db72d42f9a4' + "&bzId=" + 'b070e77e-2289-4b58-979b-2db72d42f9a4'+"&regDeptId="+regDeptId;

            $(".totrue").click(
                function () {
                    $(".diago").css("display", "none");
                    if (numT == 0) {
                        location.href = "./index.html" + jpathurl
                        localStorage.setItem("module2", 1)
                    } else if (numT == 1) {
                        location.href = "./index2.html" + jpathurl
                        localStorage.setItem("module2", 2)
                    } else if (numT == 2) {
                        location.href = "./index3.html" + jpathurl
                        localStorage.setItem("module2", 3)
                    } else if (numT == 3) {
                        location.href = "./index4.html" + jpathurl
                        localStorage.setItem("module2", 4)
                    }
                }
            )
            $(".goback-sys").click(
                function () {
                    location.href = "./index3.html" + jpathurl
                    localStorage.setItem("module2", 3)
                }
            )
            $(".diago-close").click(
                function () {
                    $(".diagoT").css("display", "none");
                    $(".diago").css("display", "none");
                    $(".diagoTime").css("display", "none");
                    $(".truemodel").css("display", "none");
                }
            )
            $(".jgsj").click(
                function () {
                    if (timeSet == 3000) {
                        $(".itemt").removeClass("active");
                        $(".itemt").eq(0).addClass("active");
                    } else if (timeSet == 5000) {
                        $(".itemt").removeClass("active");
                        $(".itemt").eq(1).addClass("active");
                    } else if (timeSet == 10000) {
                        $(".itemt").removeClass("active");
                        $(".itemt").eq(3).addClass("active");
                    } else if (timeSet == 20000) {
                        $(".itemt").removeClass("active");
                        $(".itemt").eq(3).addClass("active");
                    }
                    $(".diagoTime").css("display", "block");
                }
            )
            $(".cancel").click(
                function () {
                    $(".diago").css("display", "none");
                    $(".truemodel").css("display", "none");
                    $(".diagoTime").css("display", "none");
                }
            )
            $(".changekh").click(
                function () {
                    $(".diagoT").css("display", "block");
                    $("#cont-value").val($(".titlep").text());
                    console.log($(".titlep").text())
                }
            )
            $(".btn").click(
                function () {
                    kouhao();
                    $(".diagoT").css("display", "none");
                    $(".truemodel").css("display", "none");
                }
            )
            $(".cancelbtn").click(
                function () {
                    $(".diagoT").css("display", "none");
                    $(".truemodel").css("display", "none");
                    $(".diagoTime").css("display", "none");
                }
            )
            var timeSet = 10000;
            if (localStorage.getItem('timeSet')) {
                timeSet = localStorage.getItem('timeSet');
            }
            $(".itemt").click(
                function (index) {
                    var index = $(this).index();
                    $(".itemt").removeClass('active');
                    $(this).addClass("active");
                    if (index == 0) {
                        timeSet = 3000;
                    } else if (index == 1) {
                        timeSet = 5000;
                    } else if (index == 2) {
                        timeSet = 10000;
                    } else if (index == 3) {
                        timeSet = 20000;
                    }
                }
            )
            $(".btnTime").click(
                function () {
                    $(".diagoTime").css("display", "none");
                    $(".truemodel").css("display", "none");
                    localStorage.setItem('timeSet', timeSet);
                }
            )
            //编辑口号
            function kouhao() {
                var summaryList = $("#cont-value").val();
                var SaveWallInfo = new FormData();
                var saveParams = {
                    userId: userId,
                    // userId: 'b070e77e-2289-4b58-979b-2db72d42f9a4',
                    data: {
                        bzId: bzId,
                        // bzId: 'feae4a0f-5cac-4f03-9bca-bcfa099b54f8',
                        slogan: summaryList,
                        savetype: "slogan"
                    }
                }
                SaveWallInfo.append(
                    'json', JSON.stringify(saveParams)
                )
                $.ajax({
                    url: baseUrl + 'api/Culture/SaveWallInfo',
                    data: SaveWallInfo,
                    type: "POST",
                    contentType: false,
                    processData: false,
                    success: function (data) {
                        console.log(data);
                        location.href = "./index4.html" + jpathurl
                        // location.href="./detail1.html?number=2"
                    }
                })
            }

            function changetogo(index) {
                location.href = "./detail/detail4.html?number=" + index + '&userId=' + userId + "&bzId=" + bzId+"&regDeptId="+regDeptId;
            }

             // 点击全屏预览，再点击收缩
            function showBig(src,k){
                $('#popup img').attr('src',src);
                var j = $(window).width()/$(window).height();
                if(j<k){
                    $('#popup img').css({
                        'width': '100%',
                        'height': 'auto'
                    })
                }else{
                    $('#popup img').css({
                        'width': 'auto',
                        'height': '100%'
                    })
                }
                $('#popup').show()
            }

            $('.affairImgWrap').click(function(event){
                event = event||window.event;
                var target = document.elementFromPoint(event.clientX, event.clientY);
                k =event.target.offsetWidth/event.target.offsetHeight
                showBig(target.src,k);
            })

            $('#popup').click(function(){
                $(this).hide()
            })

        </script>
        <script src="./js/main4.js?version=1.2.8"></script>
</body>

</html>